@()(implicit request: RequestHeader)

@main {

    <h1>Server Sent Event clock</h1>

    <h1 id="clock"></h1>

    <p>
        Clock events are pushed from the Server using a Server Sent Event connection.
    </p>

    <script @{CSPNonce.attr} type="text/javascript" charset="utf-8">

       if (!!window.EventSource) {
         var stringSource = new EventSource("@routes.ScalaEventSourceController.streamClock()");
         stringSource.addEventListener('message', function(e) {
            $('#clock').html(e.data.replace(/(\d)/g, '<span>$1</span>'))
         });
       } else {
         $("#clock").html("Sorry. This browser doesn't seem to support Server sent event. Check <a href='http://html5test.com/compare/feature/communication-eventSource.html'>html5test</a> for browser compatibility.");
       }
    </script>
}
